<template>
	<view class="wrap">
		<view class="logo" style="text-align: center;">云黄河·山东</view>
		<div v-if="loginType === 'currentPhone'">
			<u-tabs :list="list" :is-scroll="false" :current="current" @change="onClickItem"></u-tabs>
			<view v-if="current === 0">
				<view class="list">
					<view class="list-call">
						<view class="iconfont icon-avatar" style="font-size: 22px;color:#FF6347;"></view>
						<input class="u-input" type="text" v-model="username" maxlength="32"
							:placeholder="$t('login.placeholderAccount')" value="admin" />

					</view>
					<view class="list-call">
						<view class="iconfont icon-key" style="font-size: 22px;color:#FF6347;"></view>
						<input class="u-input" type="text" v-model="password" maxlength="32"
							:placeholder="$t('login.placeholderPassword')" :password="!showPassword" value="admin123" />
						<image class="u-icon-right"
							:src="'/static/aidex/login/eye_' + (showPassword ? 'open' : 'close') + '.png'"
							@click="showPass()"></image>
					</view>
					<div style="padding:15rpx 0 0;">
						<view class="register">
							<!-- <navigator class="register-link" url="forget" open-type="navigate">{{$t('login.forget')}}</navigator> -->
							<!-- <navigator class="register-link" url="reg" open-type="navigate">{{$t('login.reg')}}</navigator> -->
						</view>
						<u-checkbox v-model="remember" active-color="#FF6347">{{$t('login.autoLogin')}}</u-checkbox>
					</div>
				</view>
				<view class="button" @click="submit('1')"><text>登录</text></view>
			</view>
		</div>
	</view>
</template>
<script>
	/**
	 * Copyright (c) 2013-Now http://aidex.vip All rights reserved.
	 */
	import base64 from '@/common/base64.js';
	export default {
		data() {
			return {
				phoneNo: '',
				username: '',
				password: '',
				loginType: 'currentPhone',
				showPassword: false,
				remember: true,
				isValidCodeLogin: false,
				validCode: '',
				imgValidCodeSrc: null,
				list: [{
					name: '用户名登录'
				}],
				current: 0,
				activeColor: '#FF6347',
			};
		},
		onLoad() {
			// 加载保存的用户名和密码
			this.loadSavedCredentials();
			// 获取Token
			this.getTokenFromUrl();
			
			//this.getSessionIDByLoginId('system');
			// this.getShdjLoginId(415935);
			// this.getSessionIDByLoginId('system');
			
		},
		methods: {
			
			// 从上一页url中获取token值
			 getTokenFromUrl() {
			      const params = new URLSearchParams(window.location.search);
			      var token =  params.get('token') || null;
				//  alert('token='+ token)
				  // 通过Token获取Id
				  this.getIdByToken(token);
			},
				
			// 根据Token获取Id
			getIdByToken(token){
				this.$u.api.getIdByToken({
					'access_token':token
				}).then(res=>{
					if(res.code === 200) {
						var id = res.data.id;
						// alert(JSON.stringify('根据Token获取到的Id='+id))
						this.getShdjLoginId(id);
					}
				})
				
			},	
			
			// 获取山东局login_Id
			getShdjLoginId(id){
				alert("黄委id" + id)
				this.$u.api.getShdjLoginId({
					'lxId':id
				}).then(res => {
					// alert(res + "success")
					// alert(res.data.id + "data id ")
					alert('Login_id=' + JSON.stringify(res));
					// var loginId = res.; // 拿到login_id字段即可
					// this.getSessionIDByLoginId(loginId);
				}).catch(error=>{
					// alert('错误='+ JSON.stringify(error))
				})
			 
				// this.$u.api.getShdjLoginId({}).then(res=>{
				// 	alert("hello " + res);
				// 	// 获取成功后调用 
				// 	var loginId=  'system';
				// 	this.getSessionIDByLoginId(loginId);
				// }) 
			},
				
				// 根据Login_id获取sessionid
				getSessionIDByLoginId(loginId){
					this.$u.api.getSessionIDByLoginId({
						'lCode':loginId
					}).then(res=>{
						alert('sessionID：' + sessionId);
						if(res.code === 1){
							var sessionId = res.data;
							alert('sessionID：' + sessionId);
							uni.setStorageSync('sessionid', res.data);
							
							this.$u.api.getStationData({
								'__ajax':'json',
								'__sid':sessionId
							}).then(res2=>{
								alert('站点数据：'+JSON.stringify(res2))
							});
							
						}
					})
				},
				
			loadSavedCredentials() {
				// 从本地存储中加载用户名和密码
				const savedUsername = uni.getStorageSync('savedUsername');
				const savedPassword = uni.getStorageSync('savedPassword');

				if (savedUsername) {
					this.username = savedUsername;
				}
				if (savedPassword) {
					this.password = savedPassword;
				}
			},
			encodeBase64(str) {
				// 使用 btoa 函数进行 Base64 编码，支持 Unicode 字符
				return btoa(unescape(encodeURIComponent(str)));
			},
			showPass() {
				this.showPassword = !this.showPassword;
			},
			qiehuanLogin() {
				this.loginType = 'other'
			},
			onClickItem(index) {
				this.current = index;
			},
			submit(loginType) {
				// 如果用户选择记住我，保存用户名和密码
				if (this.remember) {
					uni.setStorageSync('savedUsername', this.username);
					uni.setStorageSync('savedPassword', this.password);
				} else {
					// 如果用户不选择记住我，清除保存的用户名和密码
					uni.removeStorageSync('savedUsername');
					uni.removeStorageSync('savedPassword');
				}
				if (this.username.length == 0) {
					this.$u.toast('请输入账号');
					return;
				}
				if (this.password.length == 0) {
					this.$u.toast('请输入密码');
					return;
				}
				// Base64 编码用户名和密码
				const name_jm = this.encodeBase64(this.username);
				const pass_jm = this.encodeBase64(this.password);
				// console.log('加密用户名:' + name_jm);
				// console.log('密码:' + pass_jm);
				this.$u.api.login({
					username: name_jm,
					password: pass_jm,
					__login: 'true',
					__ajax: 'json',
					// validCode: '',
					// __sid: '',
					// param_remember: 'true',
				}).then(res => {
					if (res.result == 'true') {
						// 缓存用户信息（如 token）
						debugger
						uni.setStorageSync('sessionid', res.sessionid);
						uni.setStorageSync('userCode', res.user.system);
						uni.setStorageSync('userName', res.user.userName);
						uni.reLaunch({
							url: '/pages/sys/workbench/index'
						});
					} else {
						uni.showToast({
							title: '登录失败，请重试',
							icon: 'none'
						});
					}
				});
			},
		}
	};
</script>
<style lang="scss">
	@import 'index.scss';

	.logo {
		width: 80%;
		font-size: 64rpx;
		color: #FF6347;
		margin: 80rpx auto 80rpx auto;
	}

	.list-call-icon {
		color: #ff0000;
	}

	.currentPhone-box {
		text-align: center;
		padding: 40rpx 80rpx;

		.number-text {
			color: #000000;
			font-size: 60rpx;
		}

		.other-text {
			color: #999999;
			font-size: 26rpx;
			padding: 20rpx 0;
		}

		.u-btn {
			margin: 30rpx auto;
		}

		.u-hairline-border {
			border: 1px solid #fff;
		}
	}

	.register {
		display: inline-block;
		color: #FF6347;
		height: 40rpx;
		line-height: 40rpx;
		font-size: 28rpx;
		// float: right;
		margin-top: 6rpx;
	}

	.register-link {
		float: right;
		padding: 0 16rpx;
	}

	.reg-link {
		display: inline-block;
		color: #FF6347;
	}

	.oauth2 {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		margin: 0rpx 100rpx 30rpx;

		image {
			height: 80rpx;
			width: 80rpx;
		}
	}

	.u-tabs {
		padding: 0 70rpx;
	}
</style>